<!-- 提现设置+呼叫设置 -->
<template>
  <div class="pa-20">
    <el-tabs v-model="currentTabs" type="border-card">
      <el-tab-pane label="提现设置" name="withdraw">
        <el-form
          :model="withdrawForm"
          ref="withdrawForm"
          :rules="withdrawRules"
          label-width="150px"
          :inline="false"
          size="normal"
          style="max-width: 1000px"
        >
          <el-form-item label="最低提现金额：" prop="withdrawalMinAmount">
            <div class="disFlxAC">
              <el-input-number
                v-model="withdrawForm.withdrawalMinAmount"
                :controls="false"
                :precision="2"
                :step="1"
                :min="0"
                :max="100000"
                placeholder="保留两位小数"
              ></el-input-number>
              <div class="pl-5">元</div>
              <div class="flex0 pl-20 color9">提现金额将不小于此值才能提现</div>
            </div>
          </el-form-item>
          <el-form-item label="提现手续费比例：" prop="withdrawalFeeRate">
            <div class="disFlxAC">
              <el-input-number
                v-model="withdrawForm.withdrawalFeeRate"
                :controls="false"
                :precision="2"
                :step="1"
                :min="0"
                :max="100"
                placeholder="保留两位小数"
              ></el-input-number>
              <div class="pl-5">%</div>
              <div class="flex0 pl-20 color9">为0表示不收手续费</div>
            </div>
          </el-form-item>
          <el-form-item label="提现提示信息：" prop="withdrawalTips">
            <el-input
              style="max-width: 400px"
              type="textarea"
              placeholder="请输入提示信息"
              v-model="withdrawForm.withdrawalTips"
              maxlength="30"
              rows="4"
              show-word-limit
            >
            </el-input>
          </el-form-item>
          <el-form-item label="提现支持账户：" prop="withdrawalAccountType">
            <el-radio-group v-model="withdrawForm.withdrawalAccountType">
              <el-radio :label="1">微信</el-radio>
              <el-radio :label="2">支付宝</el-radio>
              <el-radio :label="3">银联</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="每日限提多少次：" prop="withdrawalSize">
            <div class="disFlxAC">
              <el-input-number
                v-model="withdrawForm.withdrawalSize"
                :controls="false"
                :precision="0"
                :step="1"
                :min="0"
                :max="100"
                placeholder="最高100次"
              ></el-input-number>
              <div class="pl-5">次</div>
              <div class="flex0 pl-20 color9">为0表示不限制提现次数</div>
            </div>
          </el-form-item>
          <div class="tc mt-30" v-hasPermi="['saas:setup:edit1']">
            <el-button
              type="primary"
              size="default"
              @click="update('withdrawForm')"
              >保存</el-button
            >
          </div>
        </el-form>
      </el-tab-pane>
      <el-tab-pane label="呼叫设置" name="call">
        <el-form
          :model="cellForm"
          ref="cellForm"
          :rules="cellRules"
          label-width="190px"
          :inline="false"
          size="normal"
          style="max-width: 1000px"
        >
          <el-form-item label="重呼时效限制：" prop="recallTimeLimit">
            <div class="disFlxAC">
              <el-input-number
                v-model="cellForm.recallTimeLimit"
                :controls="false"
                :precision="0"
                :step="1"
                :min="0"
                :max="2400"
                placeholder="最久100天"
              ></el-input-number>
              <div class="pl-5">小时</div>
              <div class="flex0 pl-20 color9">
                超过设置的时间，则重呼按钮消失
              </div>
            </div>
          </el-form-item>
          <el-form-item label="付费拨打未接听：" prop="callMissedTime">
            <div class="disFlxAC">
              <el-input-number
                v-model="cellForm.callMissedTime"
                :controls="false"
                :precision="0"
                :step="1"
                :min="0"
                :max="2400"
                placeholder="最久100天"
              ></el-input-number>
              <div class="pl-5">小时之内，自动取消订单，费用原路退回</div>
              <div class="flex0 pl-20 color9">从订单生成开始计算取消时间</div>
            </div>
          </el-form-item>
          <el-form-item
            label="预约咨询订单未发起咨询："
            prop="callAutoCancelTime"
          >
            <div class="disFlxAC">
              <el-input-number
                v-model="cellForm.callAutoCancelTime"
                :controls="false"
                :precision="0"
                :step="1"
                :min="0"
                :max="2400"
                placeholder="最久100天"
              ></el-input-number>
              <div class="pl-5">小时之内，自动取消订单，费用原路退回</div>
            </div>
          </el-form-item>
          <div class="pl-20 color9 fz-14">
            从具体预约的时间段的开始时间计算取消时间；如已发起咨询，但未接听，则按照付费拨打未接听的时效限制计算
          </div>
          <div class="tc mt-30" v-hasPermi="['saas:setup:edit2']">
            <el-button type="primary" size="default" @click="update('cellForm')"
              >确定修改</el-button
            >
          </div>
        </el-form>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import { settingList, settingUpdate } from "@/api/system/setup.js";

export default {
  name: "Setup",
  data() {
    return {
      currentTabs: "withdraw",
      withdrawForm: {},
      withdrawRules: {
        withdrawalMinAmount: [
          { required: true, message: "请输入", trigger: "blur" },
        ],
        withdrawalFeeRate: [
          { required: true, message: "请输入", trigger: "blur" },
        ],
        withdrawalTips: [
          { required: true, message: "请输入", trigger: "blur" },
        ],
        withdrawalAccountType: [
          { required: true, message: "请选择", trigger: "change" },
        ],
        withdrawalSize: [
          { required: true, message: "请输入", trigger: "blur" },
        ],
      },
      cellForm: {},
      cellRules: {
        recallTimeLimit: [
          { required: true, message: "请输入", trigger: "blur" },
        ],
        callMissedTime: [
          { required: true, message: "请输入", trigger: "blur" },
        ],
        callAutoCancelTime: [
          { required: true, message: "请输入", trigger: "blur" },
        ],
      },
    };
  },

  methods: {
    /** 查询列表 */
    getList() {
      settingList().then((res) => {
        this.withdrawForm = res.data["提现设置"];
        this.cellForm = res.data["呼叫设置"];
      });
    },
    update(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          const params = this[formName];
          settingUpdate(params).then((res) => {
            this.$message.success("更新成功");
          });
        }
      });
    },
  },

  created() {
    this.getList();
  },
  activated() {
    this.getList();
  },
};
</script>
<style lang='scss' scoped>
.flex0 {
  flex-shrink: 0;
}
</style>
